<template>
	<view class="shenqingfapiao" style="padding-bottom: 128rpx;">
		<view class="shenqingfapiao-main">
			<view class="shenqingfapiao-box">
				<view class="shenqingfapiao-top">
					<text class="shenqingfapiao-top_left">发票类型</text>
				</view>
				<view class="shenqingfapiao-fplx">
					<view class="fplx-cell bg1" :class="isActive == '0' ? 'active' : ''" @click="clickFplx('0')">
						普通发票
					</view>
					<view class="fplx-cell bg2" :class="isActive == '1' ? 'active' : ''" @click="clickFplx('1')">
						增值税专用发票
					</view>
					<view class="fplx-cell bg3" :class="isActive == '2' ? 'active' : ''" @click="clickFplx('2')">
						收据
					</view>
				</view>
			</view>
			<view class="shenqingfapiao-box">
				<view class="shenqingfapiao-top">
					<text class="shenqingfapiao-top_left">开票信息</text>
					<view class="shenqingfapiao-top_right" @click="toPage('kpxx')">选择</view>
				</view>
				<view style="margin: 20rpx 20rpx 0;">
					<u-skeleton rows="4" :loading="loadingList1" :title="false">
						<view class="shenqingfapiao-kpxx" v-if="list.length">
							<view class="kpxx-list" v-for="(item,index) in list" :key="index" style="margin: 0;">
								<view class="kpxx-list-top">{{item.taitou}}</view>
								<view class="kpxx-list-cell">
									<text class="kpxx-cell-left">税号：</text>
									<text class="kpxx-cell-right">{{item.shuihao == '' ? '--' : item.shuihao }}</text>
								</view>
								<view class="kpxx-list-cell">
									<text class="kpxx-cell-left">邮箱：</text>
									<text class="kpxx-cell-right">{{item.email}}</text>
								</view>
								<view class="kpxx-list-cell">
									<text class="kpxx-cell-left">类型：</text>
									<text class="kpxx-cell-right">{{item.taitoulx == 1 ? '个人' : '单位'}}</text>
								</view>
							</view>
						</view>

					</u-skeleton>
					<view class="wodefapiao-null" v-if="!list.length && !loadingList1"
						style="padding-top: 80rpx;margin-bottom: 80rpx;">
						<image src="@/static/img/wodefapiao/fapiao-null.png" class="wodefapiao-null-img"></image>
						<view class="wodefapiao-null-text">您暂时还没有相关发票信息，新增发票信息。</view>
					</view>
				</view>

			</view>
			<view class="shenqingfapiao-box">
				<view class="shenqingfapiao-top">
					<text class="shenqingfapiao-top_left">开票订单</text>
					<view class="shenqingfapiao-top_right" @click="toPage('kpdd')">选择订单</view>
				</view>
				<view class="shenqingfapiao-kpxx" v-if="kpddList.length">
					<view class="kpxx-list" v-for="(item,index) in kpddList" :key="index">
						<view class="kpxx-list-top">{{item.bianhao}}</view>
						<view class="kpxx-list-cell">
							<text class="kpxx-cell-left">公司名称：</text>
							<text class="kpxx-cell-right">{{item.company}}</text>
						</view>
						<view class="kpxx-list-cell">
							<text class="kpxx-cell-left">业务名称：</text>
							<text class="kpxx-cell-right">{{item.rmName}}</text>
						</view>
						<view class="kpxx-list-cell">
							<text class="kpxx-cell-left">订单金额：</text>
							<text class="kpxx-cell-right">￥{{item.jine}}</text>
						</view>
						<view class="kpxx-list-cell">
							<text class="kpxx-cell-left">订单时间：</text>
							<text class="kpxx-cell-right">{{item.time.replace(/T.+/, '')}}</text>
						</view>
					</view>

				</view>
				<view class="wodefapiao-null" v-else style="padding-top: 80rpx;">
					<image src="@/static/img/wodefapiao/fapiao-null.png" class="wodefapiao-null-img"></image>
					<view class="wodefapiao-null-text">没有相关的开票订单信息</view>
				</view>
			</view>
			<view class="shenqingfapiao-kefu">
				<view class="kefu-title">如您有其它问题，请联系您的专属客服</view>
				<view class="kefu-body">
					<view class="kefu-body-left">
						<view class="text">您的专属客服：{{Biduname}}</view>
						<view class="text">联系电话：<text style='color: #2F7FFF;' @click="clickCall">{{Bidumobile}}</text>
						</view>
						<view class="text">详情请添加右侧二维码</view>
					</view>
					<view class="kefu-body-right">
						<u--image :src="QRCode" width="190rpx" height="190rpx" @click="saveImage"></u--image>
					</view>
				</view>
			</view>
		</view>
		<view class="shenqingfapiao-foot">
			<view class="shenqingfapiao-foot-left">
				<view class="price">￥{{fapiaojine}}</view>
				<view class="text">发票金额</view>
			</view>
			<view class="shenqingfapiao-foot-right" @click="sumbitApply">确定申请发票</view>
		</view>
	</view>
</template>

<script>
	export default {
		/**
		 * kpxxid：对应指开票信息列表中的id
		 * fapiaoid：发票id，有订单id时才会调，因为需要传订单id
		 */
		data() {
			return {
				isActive: '-1',
				location: '11042',

				taitoulx: 1,
				taitou: '',
				email: '',
				shuihao: '',
				list: [],
				orderList: '',
				fapiaojine: 0,
				ordertype: 0,
				kpddList: [],

				// 开票信息列表中的Id
				kpxxid: '',
				// 生成的开票id
				fapiaoid: '',

				Biduname: '',
				Bidumobile: '',
				QRCode: '',
				iszhuanpiao: 0,
				fapiaotype: '',
				loadingList1: true

			}
		},
		onLoad(options) {
			if (+options.kpxxid) {
				this.kpxxid = +options.kpxxid
			}
			if (+options.jine) {
				this.fapiaojine = options.jine
			}
			if (options.orderid) {
				this.orderList = options.orderid
			}
			if (options.orderType) {
				this.ordertype = options.orderType
			}
			if (+options.fapiaoid) {
				this.fapiaoid = +options.fapiaoid
			}
			// 联系人信息
			this.getInfo()
			this.getList()
			this.getKpddList()
		},
		methods: {
			//保存二维码
			saveImage() {
				let that = this
				uni.showModal({
					title: '提示',
					content: '确定要保存图片到本地相册吗？',
					success: function(res) {
						if (res.confirm) {
							that.save()
						} else {
							console.log('用户取消了操作')
						}
					}
				})
			},
			save() {
				uni.getImageInfo({
					src: this.QRCode,
					success: function(rs) {
						uni.saveImageToPhotosAlbum({
							filePath: rs.path,
							success: function() {
								uni.showToast({
									title: '保存成功',
									icon: 'none'
								})
							},
							fail: function() {
								uni.showToast({
									title: '保存失败',
									icon: 'none'
								})
							}
						})
					}
				})
			},

			getInfo() {
				uni.$u.http
					.post('/User/custom/PC/GetUserCustomerContactHandler.ashx', {
						location: this.location,
					}).then((rs) => {
						this.Biduname = rs.lianxifangsi.Biduname
						this.Bidumobile = rs.lianxifangsi.Bidumobile
						this.QRCode = rs.lianxifangsi.QRCode
					})
					.catch((err) => {
						uni.showToast({
							title: err.msg,
							icon: "none",
						})
					})
			},
			// getFapiaoBindData() {
			// 	uni.$u.http
			// 		.post('user/fapiao/FapiaoBindHandler.ashx', {
			// 			location: this.location,
			// 			id:this.orderList
			// 		}).then((rs) => {
			// 			/**
			// 			 * kaipiaoid	开票id\
			// 			 * id			发票id
			// 			 */
			// 			if (rs.fapiao_fapiaolx == '普通发票') {
			// 				this.isActive = '0'
			// 			} else if (rs.fapiao_fapiaolx == '增值税发票') {
			// 				this.isActive = '1'
			// 			} else {
			// 				this.isActive = '2'
			// 			}
			// 			this.fapiaojine = rs.jine
			// 			this.ordertype = rs.ordertype
			// 			this.fapiaotype = rs.fapiao_fapiaolx
			// 			this.orderList = rs.orderidArr.join(',')
			// 			// 开票id
			// 			this.fapiaoid = rs.id;
			// 			if (this.orderList) {
			// 				this.getKpddList(this.fapiaoid)
			// 			}
			// 		})
			// 		.catch((err) => {
			// 			uni.showToast({
			// 				title: err.msg,
			// 				icon: "none"
			// 			});
			// 		})
			// },
			getList() {
				uni.$u.http
					.post('User/fapiao/KaipiaoListHandler.ashx', {
						location: this.location,
					}).then((rs) => {
						this.loadingList1 = false
						const data = rs.list
						if (this.kpxxid) {
							this.list = data.filter(item => {
								return item.id == this.kpxxid;
							})
						} else {
							if (data.length) {
								let arrList = []
								arrList = data.filter(item => {
									return item.id == item.mrid;
								})
								if (arrList.length) {
									this.list = arrList
									this.kpxxid = arrList[0].id
								} else {
									this.list.push(data[0])
									this.kpxxid = this.list[0].id
								}
							} else {
								this.list = []
							}
						}
						// this.getFapiaoBindData()
					})
					.catch((err) => {
						this.list = []
						this.loadingList1 = false
					})
			},
			getKpddList() {
				uni.$u.http
					.post('User/fapiao/OrderBindHandler.ashx', {
						location: this.location,
						type: this.ordertype,
						fpid: this.fapiaoid
					}).then((rs) => {
						const data = rs.list
						let idArr1 = []
						idArr1 = this.orderList.split(',')
						let idArr2 = []
						idArr2 = idArr1.map(item => Number(item))
						// 我的发票-查看（驳回项）-发票驳回-编辑 入口进来
						if (this.ordertype == 0 && this.fapiaoid) {
							this.kpddList = data
						} else {
							// 从选择订单列表页进来
							this.kpddList = data.filter(item => idArr2.includes(item.id))
						}
					}).catch((err) => {
						uni.showToast({
							title: err.msg,
							icon: "none",
						})
						this.kpddList = []
					})
			},
			clickFplx(e) {
				this.isActive = e
				if (e == '1') {
					this.iszhuanpiao = 1
					this.fapiaotype = '增值税专用发票'
				} else {
					this.iszhuanpiao = 0
					if (e == '0') {
						this.fapiaotype = '普通发票'
					} else {
						this.fapiaotype = '收据'
					}
				}
			},
			toPage(url) {
				// console.log(1, this.kpxxid)
				// 选择开票信息
				if (url == 'kpxx') {
					uni.redirectTo({
						url: '/pages/user/wodefapiao/kaipiaoxinxi?kpxxid=' + this.kpxxid
					})
				} else {
					// console.log(1, this.kpxxid)
					// 选择订单
					// if (this.kpxxid) {
					uni.redirectTo({
						url: '/pages/user/wodefapiao/dingdanList?kpxxid=' + this.kpxxid +'&orderid='+this.orderList+ '&serverTel=' + this
							.Bidumobile
					})
					// } 
					// else {
					// 	uni.redirectTo({
					// 		url: '/pages/user/wodefapiao/dingdanList?serverTel=' + this.Bidumobile
					// 	})
					// }

				}
			},
			sumbitApply() {
				if (this.isActive == '-1') {
					uni.showToast({
						title: "请选择发票类型！",
						icon: "none",
					})
					return
				}
				if (this.iszhuanpiao == 1 && this.fapiaojine < 1000) {
					uni.showToast({
						title: "发票金额小于1000元，我们将为开具普通发票，请您更换开票信息！",
						icon: "none",
					})
					return
				}
				if(this.fapiaojine == 0){
					uni.showToast({
						title: "请选择需要开票的订单",
						icon: "none",
					})
					return
				}
				uni.$u.http
					.post('User/fapiao/FapiaoApplyNewHandler.ashx', {
						location: this.location,
						isqiye: this.taitoulx,
						orderids: this.orderList,
						fapiaojine: this.fapiaojine,
						kaipiaoid: this.kpxxid,
						fapiaoid: this.fapiaoid,
						iszhuanpiao: this.iszhuanpiao,
						type: this.ordertype,
						fapiaotype: this.fapiaotype,
						version: 2
					}).then((rs) => {
						uni.navigateTo({
							url: '/pages/user/wodefapiao/shenqingchenggong'
						})

					}).catch((err) => {
						uni.showToast({
							title: err.msg,
							icon: "none",
						})
					})
			},
			clickCall() {
				uni.makePhoneCall({
					phoneNumber: this.Bidumobile
				})
			}
		}
	}
</script>

<style lang="scss">
	@import "@/static/css/fapiao.scss";

	page,
	.shenqingfapiao {
		//height: 100%;
		background-color: #f4f4f4;
	}
</style>